

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
	
	Submit a Club

</title>
        <meta name="description" content="Badminton, Badminton Clubs, Play Badminton, Badminton courts " />
        <meta name="keywords" content="Badminton, Badminton Clubs, Play Badminton, Badminton courts" />
    <link href="Content/Site.css" rel="stylesheet" type="text/css" />    
    <!-- For LOCAL-->
    <script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAATcytSR8mvGpZGALaUc8OOhT2yXp_ZAY8_ufC3CFXhHIE1NvwkxQElXY6qUXmKmYpeVwhVtW50LGAQQ"></script>
    
    <!--For PROD-->
    <!--script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAATcytSR8mvGpZGALaUc8OOhSZOUWVEB7juxYWb997FACJmh8mbhSnemR4drJ-L8ZQftUNHVhtn9Ph4g"></script--> 

    
    <!-- jQuery UI Components-->
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/humanity/jquery-ui.css" rel="stylesheet" type="text/css" />    
    
    <!-- jQuery UI Components-->
    
    <!--GA related-->
    <script type="text/javascript">

        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-1817995-3']);
        _gaq.push(['_trackPageview']);

        (function () {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
        google.load("jquery", "1.4.2");

</script>
    <!--GA related-->
    
</head>
<body>
    <div class="wrapper">
    <div class="page">
        <div id="header">            
            <div id="menucontainer">  
            <a href="/">
            <img class="logo" src="../../Content/logo.jpg" alt="BadmintonBuddy"/>
            </a>                       
            <ul id="menu">              
                <li><a href="/">Home</a></li>
                <li><a href="/Create">Submit a Club</a></li>
                <li><a href="/Feedback">Feedback</a></li>
                <li><a href="/About">About</a></li>
            </ul>
            </div>
        </div>

        <div id="main">
                 
    <script src="../../Scripts/Map.js" type="text/javascript"></script>
    <script src="http://ajax.microsoft.com/ajax/4.0/1/MicrosoftAjax.js" type="text/javascript"></script>    
    <script src="../../Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script>
    <script type="text/javascript">

        $(document).ready(function() {

            addWatermark();

            $('input:submit, input:button').button();

            $('a #locate').click(function() {
                loadLocation();
            });

            $('#Country').autocomplete({
                source: "GetCountry",
                minLength: 0
            });

            $('#State').autocomplete({
                source: function(request, response) {
                    $.ajax({
                        url: "GetState",
                        dataType: "json",
                        data: {
                            term: request.term,
                            country: $('#Country').val()
                        },
                        success: function(data) {
                            response(data);
                        }
                    });
                },
                minLength: 2
            });

            $('#City').autocomplete({
                source: function(request, response) {
                    $.ajax({
                        url: "GetCity",
                        dataType: "json",
                        data: {
                            term: request.term,
                            state: $('#State').val()
                        },
                        success: function(data) {
                            response(data);

                        }
                    });
                },
                minLength: 2
            });

            $('#optional').accordion({
                collapsible: true,
                animated: 'bounceslide',
                active: false
            });

            $('.mapoptions').dialog({
                autoOpen: false,
                show: 'blind',
                width: 600,
                height: 500,
                resizable: false,
                title: "Preview Club Location",
                buttons: { "Cancel": function() { $(this).dialog("close"); }, "Add": function(event, ui) { fillAddress(); $(this).dialog("close"); } }
            });



            $('#preview').click(function() {
                loadLocation();
                return false;
            });

            $('#submit').click(function() {
                //watermark puts all the fields with some text
                //hence MVC validation would not work,
                //check mandatory fields and then submit if everything is good.                
                if (rgbToHex($('#ClubName').css('color')) == '#aaaaaa') {
                    $('#ClubName_validationMessage').html("Please enter Club Name").css('color', 'red'); ;
                    $('#ClubName_validationMessage').show();
                    return false;

                }
                else if (rgbToHex($('#Address').css('color')) == '#aaaaaa') {
                    $('#Address_validationMessage').html("Please enter Address for the Club").css('color', 'red'); ;
                    $('#Address_validationMessage').show();
                    return false;
                }
                $('input:text').each(function() {
                if (rgbToHex($(this).css('color')) == '#aaaaaa') {
                        $(this).val("");
                    }
                });

                $('textarea').each(function() {
                if (rgbToHex($(this).css('color')) == '#aaaaaa') {
                        $(this).val("");
                    }
                });

                $('#ClubName_validationMessage').hide();
                $('#Address_validationMessage').hide();
                return true;
            });
        });    

        
    </script>    
    <div id="submitdiv">
    <div id="clubform">

    <form action="/Create" id="form0" method="post">
        
            <div class="editor-label">
                <b class="req">*</b><label for="Club Name">Club Name</label>                
            </div>
            <div class="editor-field">                
                <input class="padding5" id="ClubName" name="ClubName" size="50" type="text" value="" />                
                <span class="field-validation-valid" id="ClubName_validationMessage"></span>                               
            </div>            
            
            <div class="editor-label">                
                <label for="Country">Country</label>
            </div>
            <div class="editor-field"> 
                <input class="padding5" id="Country" name="City.State.Country.CountryName" size="50" type="text" value="" />               
                <span class="field-validation-valid" id="City_State_Country_CountryName_validationMessage"></span>                                               
            </div>            
            
            <div class="editor-label">
                <label for="State">State</label>
            </div>
            
            <div class="editor-field">
                <input class="padding5" id="State" name="City.State.StateName" size="50" type="text" value="" />                               
                <span class="field-validation-valid" id="City_State_StateName_validationMessage"></span>                                
            </div>
            
            <div class="editor-label">
                <label for="City">City</label>
            </div>
            
            <div class="editor-field">
                <input class="padding5" id="City" name="City.CityName" size="50" type="text" value="" /> 
                <span class="field-validation-valid" id="City_CityName_validationMessage"></span>                                              
            </div>           
            
            <div class="editor-label">
                <b class="req">*</b><label for="Address">Address</label>
            </div>
            <div class="editor-field">
                <input class="padding5" id="Address" name="Address" size="50" type="text" value="" />
                <span class="field-validation-valid" id="Address_validationMessage"></span>                
                <div id="locatemap">
                    <a href="javascript:loadLocation();"><img src="../../Content/map_icon.jpg" alt="Locate on map" height="40px" width="40px"/>
                    <p>Locate on Map</p></a>
                </div>                 
            </div>

            <div class="editor-label">
                <label for="Number of Courts">Number of Courts</label>
            </div>
            
            <div class="editor-field">
                <input class="padding5" id="City" name="Courts" size="50" type="text" value="" /> 
                <span class="field-validation-valid" id="Courts_validationMessage"></span>                                              
            </div>   
            
            <div class="editor-label">
                <label for="CourtSurface">CourtSurface</label>
            </div>
            
            <div class="editor-field">
                <select name="Surface">
                <option value="1">Wooden</option>
                <option value="2">Syntetic</option>
                <option value="3">Cement</option>
                <option value="4">Cement with Mat</option>
                <option value="5">Others</option>
                </select>
                <label id="lblSurface">Please Specify</label>
                <input display="none" id="Others" name="Others" type="text" value="" />
            </div>         

            <div class="editor-label">
                <label for="Website">Website</label>
            </div>
            <div class="editor-field">
                <input class="padding5" id="Website" name="Website" size="50" type="text" value="" />
                <span class="field-validation-valid" id="Website_validationMessage"></span>                
            </div>  
            
            <div class="editor-label">
                <label for="Email">Email</label><label for="(">(</label><a href="javascript:showHelp();"> Why?</a><label for=")">)</label>
            </div>
            <div class="editor-field">
                <input class="padding5" id="Email" name="Email" size="50" type="text" value="" />
                <span class="field-validation-valid" id="Email_validationMessage"></span>
            </div>           
            
            <input id="Owner" name="Owner" type="checkbox" value="true" /><input name="Owner" type="hidden" value="false" />I am the owner of the club.
            
            <!--All optional would go in this collapsable UI-->
            <div id="optional">            
            <h3><a href="#">Add more details</a></h3>
            <div id="optionalfields">
            <div class="editor-label">
                <label for="PhoneNumber">PhoneNumber</label>
            </div>
            <div class="editor-field">
                <input class="padding5" id="PhoneNumber" name="PhoneNumber" size="50" type="text" value="" />
                <span class="field-validation-valid" id="PhoneNumber_validationMessage"></span>
            </div>
            
            
            
           <div class="editor-label">
                <label for="Fees">Fees</label>
            </div>
            <div class="editor-field">
                <input class="padding5" id="Fees" name="Fees" size="50" type="text" value="" />
                <span class="field-validation-valid" id="Fees_validationMessage"></span>
            </div>
            
            
            <div class="editor-label">
                <label for="Timings">Timings</label>
            </div>
            <div class="editor-field">
                <input class="padding5" id="Timings" name="Timings" size="50" type="text" value="" />
                <span class="field-validation-valid" id="Timings_validationMessage"></span>
            </div>
            
            
            <div class="editor-label">
                <label for="Description">Description</label>
            </div>
            <div class="editor-field">
                <textarea cols="40" id="Description" name="Description" rows="5">
</textarea>
                <span class="field-validation-valid" id="Description_validationMessage"></span>
            </div>
            
            </div>
            </div>
            <!--End of optional collapsable fields-->            
            <div id="captcha">
            <div class="editor-label padding5 detailshead">
                <label>Security Check:</label>
                <label>Type both words seperated by space below</label>
            </div>            
            <script type="text/javascript">
		var RecaptchaOptions = {
			theme : 'red',
			tabindex : 0
		};

</script><script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LfDnr8SAAAAAAj6KZ0E99d_-vtwgUiOxByyzV1x">

</script><noscript>
		<iframe src="http://www.google.com/recaptcha/api/noscript?k=6LfDnr8SAAAAAAj6KZ0E99d_-vtwgUiOxByyzV1x" width="500" height="300" frameborder="0">

		</iframe><br /><textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea><input name="recaptcha_response_field" value="manual_challenge" type="hidden" />
</noscript>            
            <div id="captchaerror" class="error">Sorry! Those aren't the correct words. Please verify again.</div> 
            </div>            
            <p>
                <input type="button" id="preview" value="Preview it on Map"/>                                
                <input type="button" id="create" value="Submit" onclick="javascript:validateCaptcha('form0');"/>
                <input type="button" value="Clear" onclick="this.form.reset()" />
            </p>
    </form><script type="text/javascript">
//<![CDATA[
if (!window.mvcClientValidationMetadata) { window.mvcClientValidationMetadata = []; }
window.mvcClientValidationMetadata.push({"Fields":[{"FieldName":"ClubName","ReplaceValidationMessageContents":true,"ValidationMessageId":"ClubName_validationMessage","ValidationRules":[]},{"FieldName":"City.State.Country.CountryName","ReplaceValidationMessageContents":true,"ValidationMessageId":"City_State_Country_CountryName_validationMessage","ValidationRules":[]},{"FieldName":"City.State.StateName","ReplaceValidationMessageContents":true,"ValidationMessageId":"City_State_StateName_validationMessage","ValidationRules":[]},{"FieldName":"City.CityName","ReplaceValidationMessageContents":true,"ValidationMessageId":"City_CityName_validationMessage","ValidationRules":[]},{"FieldName":"Address","ReplaceValidationMessageContents":true,"ValidationMessageId":"Address_validationMessage","ValidationRules":[]},{"FieldName":"Courts","ReplaceValidationMessageContents":true,"ValidationMessageId":"Courts_validationMessage","ValidationRules":[{"ErrorMessage":"The field Courts must be a number.","ValidationParameters":{},"ValidationType":"number"}]},{"FieldName":"Website","ReplaceValidationMessageContents":true,"ValidationMessageId":"Website_validationMessage","ValidationRules":[]},{"FieldName":"Email","ReplaceValidationMessageContents":true,"ValidationMessageId":"Email_validationMessage","ValidationRules":[]},{"FieldName":"PhoneNumber","ReplaceValidationMessageContents":true,"ValidationMessageId":"PhoneNumber_validationMessage","ValidationRules":[]},{"FieldName":"Fees","ReplaceValidationMessageContents":true,"ValidationMessageId":"Fees_validationMessage","ValidationRules":[]},{"FieldName":"Timings","ReplaceValidationMessageContents":true,"ValidationMessageId":"Timings_validationMessage","ValidationRules":[]},{"FieldName":"Description","ReplaceValidationMessageContents":true,"ValidationMessageId":"Description_validationMessage","ValidationRules":[]}],"FormId":"form0","ReplaceValidationSummary":false});
//]]>
</script>
    </div>
    <div class="mapoptions">
        <p><b>Move marker(<img alt="marker" src="http://www.google.com/mapfiles/marker.png" height="15" width="15" />)on the map to change the location.Click Add once done.</b></p>
        <div id="mapDiv" style="height:350px">        
        </div>
    </div>
    
    <div class="help dispn">
        <p><b>Add club email contact so that users can contact if they need any more information. <p>If there is no e-mail address and you can add your e-mail address so that we can contact you in case we need any more clarification about the information. We would not use this information for any spams or service updates.</p></b></p>                
        </div>
    </div>

    
            
        </div>
        
        <div id="footer">
            
    <script src="../../Scripts/Map.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>
    <script type="text/javascript" src="../../Scripts/Captcha.js"></script>


            <script src="../../Scripts/Main.js" type="text/javascript"></script>                        
        </div>        
                
    </div>    
    </div>
</body>
</html>
